<juci-layout-with-sidebar>
	<div ng-controller="UPNPStatusPage">
		<h2 translate>UPnP Open Ports</h2>
		<div class="alert alert-info" ng-show="loaded && !upnpOpenPorts.length" translate>No UPnP ports currently in use</div>
		<table class="table" ng-show="loaded && upnpOpenPorts.length">
			<thead>
				<th>#</th>
				<th translate>Packets cnt.</th>
				<th translate>Bytes</th>
				<th translate>Target</th>
				<th translate>Proto</th>
				<th translate>Opt</th>
				<th translate>Source</th>
				<th translate>Dest.</th>
			</thead>
			<tr ng-repeat="port in upnpOpenPorts track by $index">
				<td>{{port.num}}</td>
				<td>{{port.packets}}</td>
				<td>{{port.bytes}}</td>
				<td>{{port.target}}</td>
				<td>{{port.proto}}</td>
				<td>{{port.opt}}</td>
				<td>{{port.src}}</td>
				<td>{{port.dst}}</td>
			</tr>
		</table>
	</div>
</juci-layout-with-sidebar>
